import { defineConfig, presetAttributify, presetIcons, presetUno } from 'unocss'
import twc from './src/utils/tailwindColor'

const targetShades = ['25', '150', '250', '350', '450', '550', '650', '750', '850'] as const

function extractShades(colorObject: Record<string, Record<string, string>>) {
  const result: Record<string, Partial<Record<string, string>>> = {}

  for (const [colorName, shades] of Object.entries(colorObject)) {
    const extracted: Partial<Record<string, string>> = {}

    targetShades.forEach((shade) => {
      if (shades[shade]) {
        extracted[shade] = shades[shade]
      }
    })

    if (Object.keys(extracted).length > 0) {
      result[colorName] = extracted
    }
  }

  return result
}

export default defineConfig({
  presets: [
    presetUno(), // 提供与Tailwind兼容的工具类
    presetAttributify(), // 支持属性化语法
    presetIcons({
      scale: 1.2, // 图标大小
      extraProperties: {
        'display': 'inline-block',
        'vertical-align': 'middle',
      },
    }), // 支持图标
  ],
  theme: {
    colors: extractShades(twc), // 迁移Tailwind的颜色配置
  },
  // 可以添加自定义规则和变体
  rules: [],
  variants: [],
  safelist: [], // 可以添加需要确保生成的类名
})